import React, { Component, Suspense } from 'react'
import { Route, Switch, Redirect } from 'react-router-dom'
/* import Login from './pages/Login/Login.jsx'
import Register from './pages/Register/Register.jsx'
import Index from './pages/Index/Index.jsx'
import List from './pages/List/List.jsx'
import Detail from './pages/Detail/Detail.jsx'
import Search from './pages/Search/Search.jsx'
import Coupon from './pages/Coupon/Coupon' */
// 引入登录拦截组件
import PrivateRoute from "./untils/PrivateRoute/PrivateRoute";

// 懒加载
let Login = React.lazy(() => import('./pages/Login/Login.jsx'))
let Register = React.lazy(() => import('./pages/Register/Register.jsx'))
let List = React.lazy(() => import('./pages/List/List.jsx'))
let Index = React.lazy(() => import('./pages/Index/Index.jsx'))
let Search = React.lazy(() => import('./pages/Search/Search.jsx'))
let Coupon = React.lazy(() => import('./pages/Coupon/Coupon.jsx'))
let Detail = React.lazy(() => import('./pages/Detail/Detail.jsx'))
export default class App extends Component {
  render() {
    return (
      <Suspense fallback={<div>正在努力加载中.......</div>}>
        <Switch>
          {/* 一级路由出口 */}
          <Route path="/login" component={Login}></Route>
          <Route path="/register" component={Register}></Route>
          {/*需要登录拦截的使用PrivateRoute定义路由规则  */}
          <PrivateRoute path="/index" component={Index}></PrivateRoute>
          <PrivateRoute path="/list" component={List}></PrivateRoute>
          <PrivateRoute path="/detail/:id/:type" component={Detail}></PrivateRoute>
          <PrivateRoute path="/search" component={Search}></PrivateRoute>
          <PrivateRoute path="/coupon" component={Coupon}></PrivateRoute>
          <Redirect to="/login"></Redirect>
        </Switch>
      </Suspense>
    )
  }
}
